<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h3>购物车</h3>
<input type="checkbox" value="3000">华为手机3000元<br>
<input type="checkbox" value="2000">虾米电视3000元<br>
<input type="checkbox" value="1000">苹果电脑1000元<br>
<input type="checkbox" value="100">鼠标100元<br>
<input type="checkbox" id="all">全选
<p>总价：0元</p>

<script src="../js/jquery-1.4.2.js"></script>
<script>
    //给所有多选框添加点击事件
    $("input").click(function () {
        //判断出是否全选
        if (this.id=="all"){
            //得到全选的状态
            let state = $(this).attr("checked");
            //把全选状态给到其他几个多选
            $(this).siblings("input").attr("checked",state);
            // $("input:not(#all)").siblings("input").attr("checked",state);
        }
        //计算总价
        let total = 0;
        let count = 0;
        //得到所有商品多选框 遍历
        $("input:not(#all)").each(function () {
            //this代表遍历的每一个元素
            if ($(this).attr("checked")){
                total+=this.value*1;
                count++;
            }
        })
        $("#all").attr("checked",count==4);
        //显示
        $("p").text("总价:"+total+"元");
    })
</script>

<!--<input type="checkbox">-->
<!--<script>-->
<!--  console.log($("input").attr("checked"));-->
<!--  setTimeout(function () {-->
<!--  $("input").attr("checked",true);-->
<!--  console.log($("input").attr("checked"));-->
<!--  },2000);-->
<!--</script>-->

</body>
</html>